<link rel="stylesheet" href="../src/css/pages/materialTemplate.css">
<div class="fmp-container">
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12 creatTempBtn">
                <div class="col-md-2 creatTempBtn-btn">
                    <a href="#!createMaterial" class="btn btn-default">{{i18n-newTemplateMaterialBtn}}</a>
                </div>
                <div class="col-md-2 creatTempBtn-text hidden">
                    <span>{{i18n-filterBtn}}</span>
                </div>
                <span class="sort-filter glyphicon glyphicon-filter"></span>
                <div class="searchDiv" data-order="1">
                    <div class="ndp-drop-wrapper" name="inline-drop"></div>
                    <div class="ndp-search-wrapper" name="picTemplateSearch1"></div>
                    <div class="ndp-search-wrapper" name="picTemplateSearch2"></div>
                    <span class="text">{{i18n-orderBtn}}</span>
                    <span class="sort-up glyphicon glyphicon-chevron-up"></span>
                    <span class="sort-down glyphicon glyphicon-chevron-down"></span>
                </div>
            </div>
        </div>
        <!--列表：开始-->
        <div id="picList">
            <div class="tags">
            </div>
            <div class="temp-total">{{i18n-picListTotal}}&nbsp;<span style="font-size: 14px;"></span>&nbsp;{{i18n-picListTotalText}}</div>
            <div id="masonryDom" class="grid">
            </div>
            <div class="masonryDom-finish">{{i18n-picListLoadFinish}}</div>
        </div>
        <!-- filter panel -->
        <div id="filter" class="hidden">
            <div class="filter-wrapper">
                <div class="row" name="productFeed">
                    <div class="filter-title">{{i18n-productFeed}}:</div>
                    <div class="filter-body">
                        <div class="ndp-drop-wrapper" name="tree-drop"></div>
                    </div>
                </div>
                <div class="row" name="creativeStatus">
                    <div class="filter-title">{{i18n-FilterTemplateMaterialStatus}}:</div>
                    <div class="filter-body">
                    </div>
                </div>
                <div class="row" name="creativeType">
                    <div class="filter-title">{{i18n-FilterTemplateMaterialTypes}}:</div>
                    <div class="filter-body">
                    </div>
                </div>
                <div class="row" name="adCarousel" style="position: relative;display: none;">
                    <img src="imgs/filter.png">
                    <div class="filter-body">
                    </div>
                </div>
                <div class="row" name="adLink" style="position: relative;display: none;">
                    <img src="imgs/filter.png">
                    <div class="filter-body">
                    </div>
                </div>
                <div class="row" name="adPlaceMent">
                    <div class="filter-title">{{i18n-FilterDisplayPosition}}:</div>
                    <div class="filter-body">
                    </div>
                </div>
                <div class="row" name="adTarget">
                    <div class="filter-title">{{i18n-FilterAdTarget}}:</div>
                    <div class="filter-body">
                    </div>
                </div>

                <div class="row" name="festival" style="position: relative;">
                    <!--<div class="filter-title"></div>-->
                    <img id="festivalImg" src="imgs/filter.png">
                    <div class="filter-body">
                    </div>
                </div>
            </div>
            <div class="filter-foot">
                <div style="float: right;">
                    <button naem="ok" class="btn btn-primary">{{i18n-FilterSubmitBtn}}</button>
                    <button name="cancel" class="btn btn-outline">{{i18n-FilterCancelBtn}}</button>
                </div>
            </div>
        </div>
        <!--  detail view dialog  -->
        <div id="picDetail" class="modal fade" tabindex="-1" role="dialog">
            <div class="modal-dialog" style="width: 1060px;">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title">{{i18n-PicDetailStylePreview}}</h4>
                    </div>
                    <div class="modal-body">
                        <div class="name color666"></div>
                        <div class="tag">
                        </div>
                        <div class="info color999">
                            <ul class="list-inline">
                                <li><label>{{i18n-PicDetailLastUpdateTime}}:</label><label name="updateTime" class="color666"></label></li>
                                <li><label>{{i18n-PicDetailMembershipFeed}}:</label><label name="feedName" class="color666"></label></li>
                                <li><label>{{i18n-PicDetailSuccessRate}}:</label><label name="successNums" class="color666"></label></li>
                            </ul>
                            <ul class="list-inline">
                                <li><label>{{i18n-materialPicCount}}:</label><label name="feedNums" class="color666"></label></li>
                                <li><label>{{i18n-feedPicCount}}:</label><label name="feedCount" class="color666"></label></li>
                                <li><label>{{i18n-notGenerateNum}}:</label><label name="noUseNums" class="color666"></label></li>
                            </ul>
                        </div>
                        <div id="picDetail-list" class="row"></div>
                    </div>
                    <div class="modal-footer">
                        <span>{{i18n-PicDetailRandom50}}</span><button name="replace-btn" class="btn btn-primary">
                        <i class="glyphicon glyphicon-refresh"></i>&nbsp;{{i18n-PicDetailChange}}
                    </button>
                    </div>
                </div>
            </div>
        </div>


    </div>
</div>
